<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="STYLESHEET" type="text/css" href="css/tutor.css">
        <link href='http://fonts.googleapis.com/css?family=Amaranth' rel='stylesheet' type='text/css'>
        <link href='http://fonts.googleapis.com/css?family=Merienda+One' rel='stylesheet' type='text/css'>
        <link href='css/indexcss.css' rel='stylesheet' type='text/css'>
        <link type="text/css" href="css/south-street/jquery-ui-1.8.13.custom.css" rel="stylesheet" />
        <script src="js/jquery.js" type="text/javascript"></script>
        <script src="js/jquery-ui-1.8.13.custom.min.js" type="text/javascript"></script>
        <script src="js/tutor.js" type="text/javascript" ></script>
        <style type="text/css">
            .ui-effects-transfer { border: 2px dotted gray; } 
        </style>
        <script type="text/javascript">
            var objGlobal;
        $(document).ready(function (){
            $(":button").button();
            $("#username").focus();
            btnGlobal = $("#btningresa");
            divGlobal = $("#logueo");
        }); //fin $(document).ready(function (){

        function anima(div,btn,opc){
            var tmp = "#" + btn.attr("id");
            if(div.is(":visible") && opc)
                div.css('display','none');
             else{
                div.css("display","block");
                div.effect('slide', { }, 900);
             }                     
             return;
            
        }

        function validaMail(opc){ //funcion para validar el correo
            switch (opc) {
            case 0:
                //valido que sea un correo electronico
                if($("#correoEle").val().match(/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/)) return true;
                else{
                    mensajes("Digita una cuenta de correo valida", 1, false);
                    $("#correoEle").focus();
                    return false;
                }
                break;
            case 1:
                //valido que sea un correo electronico
                if($("#usernameRe").val().match(/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/)) return true;
                else{
                    mensajes("Digita la cuenta de correo para asignarte una nueva contraseña", 0, false);
                    $("#usernameRe").focus();
                    return false;
                }
                break;
            case 2:
                //valido que sea un correo electronico
                if($("#username").val().match(/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/)) return true;
                else{
                    mensajes("No has ingresado una cuenta de correo Valida", 0, false);
                    $("#username").focus();
                    return false;
                }
                break;
            default:
                break;
            }
        } //fin function validaMail(opc){

        function valida(opc){ //funcion para validar los valores del correo
            switch (opc) {
                case 1:
                    if(validaMail(opc)){
                        $.post("scripts/registra.php", {correo:$("#usernameRe").val(),opc:'2'}, function(dato){
                            if(dato == 1){
                                mensajes("Se te ha enviado un correo con la nueva contraseña.", 2, false);
                                $.post("scripts/correo.php", {correo:$("#usernameRe").val(),opc:'0'});
                                return true;
                            }
                            else{
                                mensajes("¡Ups, un error! " + dato, 0, false);
                                $("#usernameRe").focus();
                                return false;
                            }
                        });
                    }
                    else return false;
                break;
                case 0: //cuando crea el registro
                    if(validaMail(opc)){
                        if($("#nombre").val() == ""){
                            mensajes("Digita el Nombre por favor", 1, false);
                            $("#nombre").focus();
                            return false;
                        }
                        if($("#apellido").val() == ""){
                            mensajes("Tu apellido es necesario", 1, false);
                            $("#apellido").focus();
                            return false;
                        }
                        if($("#seudonimo").val() == ""){
                            mensajes("¿Como te gustaria que te llamaramos?", 1, false);
                            $("#seudonimo").focus();
                            return false;
                        }
                        if($("#contraseña").val() == ""){
                            mensajes("¡Ponle seguridad a tu cuenta!", 1, false);
                            $("#contraseña").focus();
                            return false;
                        }
                        $.post("scripts/registra.php", $("#formCrea").serialize(), function(dato){
                            if(dato == 1){
                                mensajes("Tu registro es satisfactorio en tú correo encontraras los datos de acceso.", 2, false);
                                $.post("scripts/correo.php", {correo:$("#correoEle").val(),opc:'1'});
                                $("#formCrea").trigger('reset');
                                return true;
                            }
                            else{
                                mensajes("¡Ups, un error! " + dato, 0, false);
                            }
                        });//fin $.post("scripts/registra", $("#formCrea").serialize(), function(){
                    }
                    else return false;
                break;                
                case 2: //ingresa al sistema
                if(validaMail(opc)){
                    $.post("scripts/registra.php", $("#ingreso").serialize(), function(dato){
                        if(dato == 1){
                            $("#ingreso").submit();
                            return true;
                        }
                        else{
                            mensajes("¡Ups, un error! " + dato, 0, false);
                        }
                    });//fin $.post("scripts/registra", $("#formCrea").serialize(), function(){
                }
                break;
                default:
                break;
            }
        } //fin function valida(opc){
        
        
        function visible(objDiv,objBtn){
            if(!(btnGlobal.attr("id") == objBtn.attr("id"))){
                anima(divGlobal,btnGlobal,true);
                btnGlobal = objBtn;
                divGlobal = objDiv;
            }
            //objBtn.trigger("click")
            anima(objDiv,objBtn);
            return true;
        }

        </script>
        <title>Tutor en C</title>
    </head>
    <body>
        <div id="contenedor" >
            <div id="titulo" >
                TUTOR ORIENTADO A LA PROGRAMACIÓN BÁSICA EN LENGUAJE C
            <hr/>
            </div> <!--<div id="titulo">-->
            <?php include 'includes/body.php'; ?>
            <div id="divTexto" >
                <p>¡Bienvenido al Sistema Tutor Web!, este tutor te ayudará a reforzar y/o mejorar tus conocimientos en la programación básica de computadores bajo el lenguaje C.</p>
                <p>El registro es completamente libre y sin restricciones. </p>
            </div> <!--<div id="texto">-->
            <div id="divContenido">
                <div id="divNavegacion">
                    <button id="btningresa" onclick="visible($('#logueo'),$('#btningresa'));" >LOGIN</button><button id="btnRecordar" onclick="visible($('#divRecordar'),$('#btnRecordar'));" >RECORDAR CLAVE</button><button id="btnRegistra" onclick="visible($('#ingresar'),$('#btnRegistra'));" >REGISTRATE</button>
                </div>
            </div>           
            <div id="logueo" class="divVisual" style="display: block" >
                    <form name="ingreso" id="ingreso" method="POST" action="frentes/principal.php">
                        <table  >
                            <caption>Aquí vamos...</caption>
                            <tbody>
                                <tr>
                                    <td><label for="username">E-mail</label> </td>
                                    <td><input type="text" name="username" id="username" /><input type="hidden" name="opc" id="opc" value="3" /> </td>
                                </tr>
                                <tr>
                                    <td><label for="clave">Contraseña</label> </td>
                                    <td><input type="password" name="clave" id="clave" /> </td>                                
                                </tr>
                                <tr>
                                    <td colspan="2" align="center">
                                        <input type="button" id="enviar" value="Ingresar" onclick="return valida(2);" />
                                        <input type="hidden" name="opc" id="opc" value="3" />
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </form>
                </div> <!-- <div id="logueo" > -->
                <div id="divRecordar" class="divVisual">
                    <table>
                        <tbody>
                        <caption>Danos tu correo y te enviaremos una nueva contraseña</caption>
                            <tr>
                                <td><label for="usernameRe">E-mail</label> </td>
                                <td><input type="text" name="usernameRe" id="usernameRe" /> </td>
                            </tr>
                            <tr align="center">
                                <td colspan="2"><input type="button" onclick="return valida(1);" value="Recordar contraseña"  /></td>
                            </tr>
                        </tbody>                        
                    </table>
                </div> <!-- fin divRecordar -->
                <div id="ingresar" class="divVisual" >
                    <form id="formCrea" method="post" action="" >
                     <table>
                         <caption>Llena estos campos y podras ingresar al sistema</caption>
                         <tr>
                             <td><label for="nombre" >Nombres</label></td>
                             <td><input type="text" id="nombre" name="nombre" /></td>
                             <td><label for="apellido" >Apellidos</label></td>
                             <td><input type="text" id="apellido" name="apellido" /></td>
                         </tr>
                         <tr>
                             <td><label for="seudonimo">Seudonimo</label></td>
                             <td><input type="text" id="seudonimo" name="seudonimo" /></td>
                             <td><label for="correoEle" >E-mail</label></td>
                             <td><input type="text" id="correoEle" name="correoEle" /></td>
                         </tr>
                         <tr>
                             <td><label for="contraseña">Contraseña</label></td>
                             <td><input type="password" id="contraseña" name="contraseña" /></td>
                         </tr>
                         <tr>
                             <td align="center" colspan="4">
                                 <input type="button" id="registrar" value="Registrate" onclick="return valida(0);" /><input type="hidden" name="opc" id="opc" value="1" />
                             </td>
                         </tr>
                     </table>
                    </form>
                </div> <!--<div id="ingresar">-->
            </div> <!-- fin <div id="divNavegacion"> -->
        </div> <!--<div id="contenedor">-->
    </body>
</html>
